import React, { memo, useState } from 'react'

const counter = memo(() => {
  // 利用useState创建一个状态 接收的这个参数就是这个状态的初始值
  // useState返回一个数组 第一个元素是状态 第二个元素是修改状态的方法
  // 修改状态必须使用提供的方法 将新状态传入进去
  // 所有的 hooks 都必须在函数式组件的顶层使用
  const [count, setCount ] = useState(0)
  function changeCount(num){
    setCount(num)
  }
  return (
    <div>
      <h4>当前计数:{count}</h4>
      <button onClick={() => changeCount(count + 1)}>+1</button>
      <button onClick={() => changeCount(count - 1)}>-1</button>
    </div>
  )
})

export default counter